<template>
	<view>
		<view>
			<view class="delect-addrsBox" v-if="is_choose == false" @click="chooseAdd">选择收货地址</view>
			<view class="choose-adrsBox" v-else>
				<view class="box-left">
					<view class="detl_adrs">{{d_address}}</view>
					<view class="torn_adrs">{{address}}</view>
				</view>
				<view class="box-right" @click="chooseAdd">修改地址</view>
			</view>
			<view class="form-box">
				<view class="title">门牌号</view>
				<input class="context" type="text" v-model="addressDoor" placeholder="例1层101室">
			</view>
			<view class="form-box">
				<view class="title">联系人</view>
				<input class="context" type="text" v-model="username" placeholder="填写收货人的姓名">
			</view>
			<view class="form-box">
				<view class="title">手机号</view>
				<input class="context" type="number" v-model="mobile" placeholder="填写收货手机号">
			</view>
			<view class="form-box">
				<view class="title">设置为默认收货地址</view>
				<switch class="context" :checked="is_default == 1?true:false" color="#ff723b"
					style="transform:scale(0.7)" @change="switchChange($event)" />
			</view>
		</view>

		<view class="but" @click="submit">
			保存信息
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				username: '',//联系人
				mobile: '',//手机号
				type: '',//1、编辑，0、添加
				is_default: 0,//是否默认
				item_id: '',//列表id
				is_choose: false,//手动是否选择了地址
				latitude: '',//纬度
				longitude: '',//经度
				address: '',//地址
				d_address: '',//详细地址
				addressDoor: '',//门牌号
				check:0
			}
		},
		onLoad(e) {
			let loginstatus = uni.getStorageSync('token');
			if(loginstatus)
			{
				this.check = 1
			}
			if (e.type == 1) {
				this.item_id = e.item_id
				this.type = e.type
				this.getEditData(e.item_id)
			}
		},
		methods: {
			//地图选择/修改收货地址
			chooseAdd() {
				let that = this
				uni.chooseLocation({
					success: function(res) {
						console.log('选择地址', res);
						that.latitude = res.latitude
						that.longitude = res.longitude
						that.address = res.address
						that.d_address = res.name
						that.is_choose = true
					}
				});
			},

			// 修改/编辑地址
			getEditData(Lid) {
				this.is_choose = true
				this.$ajaxRequest.get(this.baseUrl + 'shop/Member/findAddress', {
					Lid: Lid
				}, true).then(res => {
					console.log('编辑数据', res.data.data)
					if (res.data.code == 200) {
						let listData = res.data.data.addressData
						this.username = listData.name
						this.mobile = listData.phone
						this.address = listData.address
						this.addressDoor = listData.address_door
						this.d_address = listData.detailed_address
						this.is_default = listData.is_default
						this.latitude = listData.latitude
						this.longitude = listData.longitude

					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}
				})
			},

			submit() {
				if(this.check)
				{
					let reg = /^1[0123456789]\d{9}$/
					if (this.username == '') {
						uni.showToast({
							title: '请填写姓名',
							icon: 'none'
						})
					} else if (this.mobile == '') {
						uni.showToast({
							title: '请填写手机号',
							icon: 'none'
						})

					} else if (this.mobile != '' && !reg.test(this.mobile)) {
						uni.showToast({
							title: '手机号格式不正确',
							icon: 'none'
						})
					} else if (this.latitude == '' || this.longitude == '' || this.address == '' || this.d_address == '') {
						uni.showToast({
							title: '请填写地址',
							icon: 'none'
						})
					} else {
						this.saveInfo()
					}
				}else{
					uni.showToast({
						title:'请先登录',
						icon:'error'
					})
				}
			},
			//开关 是否默认地址
			switchChange(e) {
				if (e.detail.value) {
					this.is_default = 1
				} else {
					this.is_default = 0
				}
			},
			saveInfo() {
				this.$ajaxRequest.post(this.baseUrl + 'shop/Member/address', {
					type: this.type,
					id: this.item_id,
					uid: uni.getStorageSync('UserInfo').id,
					username: this.username, //名字
					phone: this.mobile, //手机
					latitude: this.latitude,//纬度
					longitude: this.longitude,//经度
					address: this.address,//地址
					d_address: this.d_address, // 详细地址
					address_door: this.addressDoor,//门牌号
					is_default: this.is_default //是否默认地址
				}, true).then(res => {
					if (res.data.code == 200) {
						uni.navigateBack({
							delta: 1, //返回层数，2则上上页
						})
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none',
							success() {
								uni.navigateBack({
									delta: 1, //返回层数，2则上上页
								})
							}
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FAFAFA;
	}

	.delect-addrsBox {
		height: 74rpx;
		width: 90%;
		margin: 50rpx auto;
		margin-bottom: 50rpx;
		background-color: #fff;
		color: #ff723b;
		border: 1rpx solid #ff723b;
		border-radius: 10rpx;
		text-align: center;
		line-height: 76rpx;
	}

	.choose-adrsBox {
		margin: 50rpx auto;
		margin-bottom: 30rpx;
		background-color: #fff;
		width: 94%;
		// height: 150rpx;
		border-radius: 10rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx 20rpx;

		.box-left {
			width: 70%;
			.detl_adrs {
				font-size: 32rpx;
				font-weight: bold;
			}

			.torn_adrs {
				font-size: 28rpx;
				color: #999;
			}
		}

		.box-right {
			color: #ff723b;
			border: 1rpx solid #ff723b;
			border-radius: 10rpx;
			font-size: 32rpx;
			height: 60rpx;
			width: 25%;
			// width: 150rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}

	.form-box {
		display: flex;
		align-items: center;
		font-size: 30rpx;
		height: 100rpx;
		background-color: #fff;
		margin-bottom: 4rpx;
		padding: 0 30rpx;

		.title {}

		.context {
			margin-left: 30rpx;
		}
	}

	.but {
		position: fixed;
		bottom: 30rpx;
		width: 690rpx;
		height: 90rpx;
		background: linear-gradient(-17deg, rgba(255, 114, 59, 1), rgba(255, 147, 67, 1));
		border-radius: 45rpx;
		left: 30rpx;
		text-align: center;
		line-height: 90rpx;
		color: white;
	}
</style>
